<template>
  <div class="home-trends-block">
    <div class="teacher-trends">
      <div class="teacher-info">
        <div class="block-title">
          <div class="title">教师风采</div>
          <div class="more" @click="$router.push({name: 'jsfc'})">更多<img :src="moreIcon"/></div>
        </div>
        <div class="teacher-list">
          <teacher-info style="width: 30%" v-for="item in teacherList" :data="item"></teacher-info>
        </div>
      </div>
      <div class="trends-list">
        <div class="block">
          <div class="block-title">
            <div class="title">研训动态</div>
            <div class="more">更多<img :src="moreIcon"/></div>
          </div>
          <div class="list-item" @click="$router.push({name: 'misArticle', query:{
        sno: item.sno
      }})" v-for="(item,index) in jyky">
            <div class="number" :class="[index<=2?'red':'']">{{ index + 1 }}</div>
            <div class="info">{{item.title}}</div>
            <div class="date">[{{ dayjs(item.deploydate).format("YYYY-MM") }}]</div>
          </div>
        </div>
        <div class="block">
          <div class="block-title">
            <div class="title">远程教育</div>
            <div class="more">更多<img :src="moreIcon"/></div>
          </div>
          <div class="list-item" @click="$router.push({name: 'misArticle', query:{
        sno: item.sno
      }})" v-for="(item,index) in ycjy">
            <div class="number" :class="[index<=2?'red':'']">{{ index + 1 }}</div>
            <div class="info">{{item.title}}</div>
            <div class="date">[{{ dayjs(item.deploydate).format("YYYY-MM") }}]</div>
          </div>
        </div>
      </div>
    </div>
    <div class="img-link">
      <div class="block-title">
        <div class="title">友情链接</div>
      </div>
      <div class="img-list">
        <img :src="item" v-for="item in imgList"/>
      </div>
    </div>
  </div>
</template>

<script>
import moreIcon from '../../image/index/more_icon.png'
import linkImg1 from '../../image/index/link_icon1.png'
import linkImg2 from '../../image/index/link_icon2.png'
import linkImg3 from '../../image/index/link_icon3.png'
import linkImg4 from '../../image/index/link_icon4.png'
import linkImg5 from '../../image/index/link_icon5.png'
import linkImg6 from '../../image/index/link_icon6.png'
import TeacherInfo from '../teacher-brief-info/teacher-brief-info'
import {getLatestJyky, getLatestMsfc, getLatestYcjy} from "@/api/content";
import dayjs from "dayjs";

export default {
  name: "home-trends-block",
  components: {
    TeacherInfo
  },
  async created() {
    let res = await getLatestMsfc();
    let res2 = await getLatestYcjy();
    let res3 = await getLatestJyky();
    this.teacherList = res.data
    this.ycjy = res2.data
    this.jyky = res3.data
  },
  data() {
    return {
      dayjs,
      teacherList:[],
      ycjy:[],
      jyky:[],
      moreIcon,
      imgList: [linkImg1, linkImg2, linkImg3, linkImg4, linkImg5, linkImg6]
    }
  }
}
</script>

<style lang="scss" src="./index.scss" scoped>

</style>
